<% @class = "theme-auto" %>

<% content_for :form_content do %>

  <div class="border rounded-md p-6 md:p-12 mb-8">
    <%= form_for @user, url: password_reset_path(params[:id]) do |f| %>
      <h1 class="font-bold text-lg mb-4">Reset Password</h1>
      <%= render partial: "shared/flash", locals: {flash: flash} %>
      <% if @user.errors.present? %>
        <div class="alert alert-error">
          <%= @user.errors.full_messages.join('. ') %>.
        </div>
      <% end %>

      <div class="mb-8">
        <%= render Form::TextInputComponent.new do |text| %>
          <% text.label_content do %>
            <%= f.label :password, "Password" %>
          <% end %>
          <% text.input do %>
            <%= f.password_field :password, class: "text-input" %>
          <% end %>
        <% end %>
      </div>

      <button type="submit" class="button flex w-full" tabindex="3">Reset Password</button>
    <% end %>
  </div>
  <p class="text-center text-500">Already have an account?</p>
  <p class="text-center"><%= link_to "Sign In", login_path, class: "font-medium" %></p>
<% end %>

<%= render template: "layouts/form_page" %>
